<template>
  <div class="gi_table_page">
    <GiTable title="软件管理" row-key="id" :data="dataList" :columns="columns" :loading="loading"
      :scroll="{ x: '100%', y: '100%', minWidth: 1000 }" :pagination="pagination" :disabled-tools="['size']"
      :disabled-column-keys="['name']" @refresh="search">
      <template #toolbar-left>
        <a-input-search v-model="queryForm.fuzzy" style="width: 300px;" placeholder="编号/名称/类型/供应商" allow-clear
          @search="search" />
        <a-button @click="reset">
          <template #icon><icon-refresh /></template>
          <template #default>重置</template>
        </a-button>
      </template>
      <template #toolbar-right>
        <a-button v-permission="['asset:software:records:create']" type="primary" @click="onAdd">
          <template #icon><icon-plus /></template>
          <template #default>新增</template>
        </a-button>
        <a-button v-permission="['asset:softwareRecords:export']" @click="onExport">
          <template #icon><icon-download /></template>
          <template #default>导出</template>
        </a-button>
      </template>
      <template #distribution="{ record }">
        <a-tag v-if="record.distribution == 0">未知</a-tag>
        <a-tag v-if="record.distribution == 1">开源</a-tag>
        <a-tag v-if="record.distribution == 2" color="green">免费</a-tag>
        <a-tag v-if="record.distribution == 3" color="red">商业授权</a-tag>
      </template>
      <template #action="{ record }">
        <a-space>
          <a-link v-permission="['asset:software:records:get']" title="详情" @click="onDetail(record)">详情</a-link>
          <a-link v-permission="['asset:software:records:update']" title="修改" @click="onUpdate(record)">修改</a-link>
          <a-link v-permission="['asset:software:records:delete']" status="danger" :disabled="record.disabled"
            :title="record.disabled ? '不可删除' : '删除'" @click="onDelete(record)">
            删除
          </a-link>
        </a-space>
      </template>
    </GiTable>

    <SoftwareRecordsAddModal ref="SoftwareRecordsAddModalRef" @save-success="search" />
    <SoftwareRecordsDetailDrawer ref="SoftwareRecordsDetailDrawerRef" />
  </div>
</template>

<script setup lang="ts">
  import type { TableInstance } from '@arco-design/web-vue'
  import SoftwareRecordsAddModal from './SoftwareRecordsAddModal.vue'
  import SoftwareRecordsDetailDrawer from './SoftwareRecordsDetailDrawer.vue'
  import { type SoftwareRecordsResp, type SoftwareRecordsQuery, deleteSoftwareRecords, exportSoftwareRecords, listSoftwareRecords } from '@/apis/asset/software/records'
  import { useDownload, useTable } from '@/hooks'
  import { useDict } from '@/hooks/app'
  import { isMobile } from '@/utils'
  import has from '@/utils/has'

  defineOptions({ name: 'SoftwareRecords' })


  const queryForm = reactive < SoftwareRecordsQuery > ({
    fuzzy: undefined,
    sort: ['id,desc']
  })

  const {
    tableData: dataList,
    loading,
    pagination,
    search,
    handleDelete
  } = useTable((page) => listSoftwareRecords({ ...queryForm, ...page }), { immediate: true })
  const columns: TableInstance['columns'] = [
    { title: '编号', dataIndex: 'code', slotName: 'code' },
    { title: '名称', dataIndex: 'name', slotName: 'name' },
    { title: '类型', dataIndex: 'categoryName', slotName: 'categoryName' },
    { title: '供应商', dataIndex: 'producerName', slotName: 'producerName' },
    { title: '版本号', dataIndex: 'version', slotName: 'version' },
    { title: 'SN', dataIndex: 'sn', slotName: 'sn' },
    { title: '价格', dataIndex: 'price', slotName: 'price' },
    { title: '购买日期', dataIndex: 'purchaseDate', slotName: 'purchaseDate' },
    { title: '过保日期', dataIndex: 'expireDate', slotName: 'expireDate' },
    { title: '授权数量', dataIndex: 'counts', slotName: 'counts' },
    { title: '发行方式', dataIndex: 'distribution', slotName: 'distribution' },
    {
      title: '操作',
      dataIndex: 'action',
      slotName: 'action',
      width: 160,
      align: 'center',
      fixed: !isMobile() ? 'right' : undefined,
      show: has.hasPermOr(['asset:software:records:get', 'asset:software:records:update', 'asset:software:records:delete'])
    }
  ]

  // 重置
  const reset = () => {
    queryForm.name = undefined
    queryForm.categoryId = undefined
    queryForm.version = undefined
    queryForm.vendorId = undefined
    queryForm.counts = undefined
    queryForm.createUser = undefined
    queryForm.createTime = undefined
    search()
  }

  // 删除
  const onDelete = (record: SoftwareRecordsResp) => {
    return handleDelete(() => deleteSoftwareRecords(record.id), {
      content: `是否确定删除该条数据？`,
      showModal: true
    })
  }

  // 导出
  const onExport = () => {
    useDownload(() => exportSoftwareRecords(queryForm))
  }

  const SoftwareRecordsAddModalRef = ref < InstanceType < typeof SoftwareRecordsAddModal >> ()
  // 新增
  const onAdd = () => {
    SoftwareRecordsAddModalRef.value?.onAdd()
  }

  // 修改
  const onUpdate = (record: SoftwareRecordsResp) => {
    SoftwareRecordsAddModalRef.value?.onUpdate(record.id)
  }

  const SoftwareRecordsDetailDrawerRef = ref < InstanceType < typeof SoftwareRecordsDetailDrawer >> ()
  // 详情
  const onDetail = (record: SoftwareRecordsResp) => {
    SoftwareRecordsDetailDrawerRef.value?.onOpen(record.id)
  }
</script>

<style scoped lang="scss"></style>